import Icon from "@/components/Icon";
import styles from "./index.module.scss";
import classNames from "classnames";
import { useHistory } from "react-router-dom";

interface INavBarProps {
  className?: string;
  style?: React.CSSProperties;
  children?: React.ReactNode;
  right?: React.ReactNode;
  onBack?: () => void;
}

function NavBar({ className, style, children, right, onBack }: INavBarProps) {
  const history = useHistory();

  return (
    <div className={styles.root}>
      <div className={classNames("main", className)} style={style}>
        <div className="left">
          <Icon type="iconfanhui" onClick={onBack || history.goBack} />
        </div>
        <div className="title">{children}</div>
        <div className="right">{right}</div>
      </div>
    </div>
  );
}
export default NavBar;
